<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
		<title>畅聊星海</title>
		<script src="js/layui/layui.js"></script>
		<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
		<link rel="stylesheet" href="js/layui/css/layui.css" />
		<link rel="stylesheet" href="css/main.css" />
		<style>
			
		</style>
	</head>
	<body>
		<div class="page">
			<!--
            	作者：1832600296@qq.com
            	时间：2018-02-25
            	描述：宣传图片
            -->
            <div class="layui-carousel" id="carousel">
				<div carousel-item>
					<img src="img/ArtsPalace.jpg" />
					<!--<img src="img/2.jpg" />
					<img src="img/3.jpg" />-->
				</div>
			</div>
		</div>
	</body>
</html>
<script>
	//注意：导航 依赖 element 模块，否则无法进行功能性操作
	layui.use(['element', 'carousel'], function() {
		var element = layui.element,
			carousel = layui.carousel;

		//宣传图片
		carousel.render({
			elem: '#carousel',
			width: '100%', //设置容器宽度
			height: '220px',
			autoplay:false,
			arrow: 'none', //始终显示箭头
			indicator:'none',
			anim: 'fade', //切换动画方式
			interval: 10000 //10秒
		});
		
	});
</script>
